import type { IQuery, IResponse, TableResponse } from '@/api/config/types';
import type { ThemeCanvas } from '@/types/theme';
import axios from 'axios';

export interface ThemeData {
  themeName: string;
  width: number;
  height: number;
  background: string;
  themeBoard: string;
  video?: any;
  image: ThemeCanvas[];
}

const baseURL = '/theme/template';

export const listTheme = (query?: IQuery) => {
  return axios.get<TableResponse<LcdTheme>>(`${baseURL}/list`, { params: query });
};

export interface LcdTheme {
  themeId: string;
  themeName: string;
  themeBoard: string;
  deptId: null;
  width?: number;
  height?: number;
  background: string;
  image: ThemeCanvas[];
  scale: number;
  imgSrc: string;
  category: string;
  share: '0' | '1';
  major: '0' | '1';
  sizeId?: string;
}

export const getTheme = (id: string | number) => {
  return axios.get<IResponse<LcdTheme>>(`${baseURL}/${id}`);
};

export const createTheme = (data: Partial<ThemeData>) => {
  return axios.post(`${baseURL}`, data);
};

export const updateTheme = (data: Partial<ThemeData>) => {
  return axios.put(`${baseURL}`, data);
};

export const deleteTheme = (ids: string[]) => {
  return axios.delete(`${baseURL}/${ids.join(',')}`);
};

export const previewTheme = (goodsId: string, componentId: string) => {
  return axios.get<IResponse<string>>(`/theme/component/preview`, {
    params: { componentId, goodsId },
  });
};

export const themeFunc = (id: string) => {
  return axios.get(`/theme/template/func/${id}`);
};
